/**
 * 日常任务
 * @author zhangqiang
 * @date   2016/10/11
 */
(function (lf, r) {

    var ajax = lf.utils.ajax,
        doAction = lf.bridgeJs.doAction,
        RC = r.createClass;
    var menuList = [
        {
            code: "TASK-CONFIRM",
            type: 'text',
            name: '待回复',
            color: 'redNum red',
        },
        {
            code: "TASK-FEEDBACK",
            type: 'text',
            name: '待审核',
            color: 'redNum red',
        },
        {
            code: "TASK-CHECK",
            type: 'text',
            name: '已回复',
            color: 'redNum green',
        },
        {
            code: "",
            type: '',
            name: '',
        },
    ]

    const CONFIRM = 'confirm',
        FEEDBACK = 'feedback',
        CHECK = 'check',
        ADD = 'add';

    var Panel = React.createClass({
        getInitialState: function () {
            return ({
                numList: {},
            })
        },
        componentWillMount: function () {
            var user = this.props.user,
                me = this;
            me.resetNum(user);
            lf.appJs.refresh(function (user) {
                me.resetNum(user);
            });
        },
        resetNum: function (user) {
            var me = this;
            //获取数字
            ajax({
                type: 'get',
                data: {
                    staffId: user.id,
                },
                success: function (data) {
                    me.setState({
                        numList: data.data,
                    });
                }
            },'/api/work/event/getEventConsultAmount');
        },
        componentDidMount: function () {
            let $listPage = $('.list');
            var me = this;
            $listPage.each(function (i) {
                var $me = $(this);
                $me.off();
                $me.on('tap', function () {
                    var code = me.props.menuList[i].code;

                    if (code == 'TASK-CONFIRM')
                        doAction('report-reply.html?type=' + CONFIRM, '待回复列表');

                    if (code == 'TASK-FEEDBACK')
                        doAction('report-reply.html?type=' + FEEDBACK, '待审核列表');

                    if (code == 'TASK-CHECK')
                        doAction('report-reply.html?type=' + CHECK, '已回复列表');
                });
            })
        },
        render: function () {
            let item2DArray = lf.utils.to2DArray(this.props.menuList || [], 2);
            let menus = item2DArray.map((array, i) => {
                return (
                    <div key={'array' + i} className="item-row">
                        {
                            array.map(menu => {
                                return <div key={menu.id} className="item list">
                                    <div>
                                        <span className={menu.color}>
                                            {this.getNum(menu.code)}
                                        </span>
                                        <p className={menu.type}>{menu.name}</p>
                                    </div>
                                </div>
                            })
                        }
                    </div>
                );
            });

            return (
                <div className="box">
                    {menus}
                </div>
            );
        },
        getNum(code) {
            let numList = this.state.numList,//this a object
                num = ' ';

            if (code == 'TASK-CONFIRM')
                num = numList.notReplyAmount;

            if (code == 'TASK-FEEDBACK')
                num = numList.notCheckAmount;

            if (code == 'TASK-CHECK')
                num = numList.hasReplyAmount;

            if (code == 'TASK-ADD') {
                num = '';
            }
            // if (code == 'TASK-DISPATCH')
            //     num = numList.waitCheckCount;

            // if (code == 'TASK-BACK')
            //     num = numList.waitCheckCount;
            //
            // // if (code == 'TASK-COMPLETE')
            // //     num = numList.waitCheckCount;
            //
            return num;
        }
    });

    /**
     * props:
     *  user
     *  menuList
     */
    var Body = RC({
        getInitialState: function () {
            return ({
                list: []
            })
        },
        componentWillMount: function () {
            this.getList(this.props.user);

        },
        getList: function (user) {
            this.setState({
                list: <Panel user={user} menuList={this.props.menuList}/>
            });
        },
        render: function () {
            //TODO 组件化
            if (!this.props.menuList.length) //数据为空
                return <div style={{textAlign: 'center', paddingTop: '1rem'}}>请联系管理员授权</div>

            return (
                <div className="notice">
                    {this.state.list}
                </div>
            );
        }
    });

    lf.appJs.getUser(function (user) {
        /*  ajax({
         type: 'POST',
         data: {
         staffId: user.id,
         sysMenuId: lf.utils.getUrlParam('menuId')
         }
         }, lf.api.menuList, function (menuList) {*/
        r.render(
            <Body user={user} menuList={menuList}/>,
            document.getElementById('root'), function () {
                $('#root').css('background', '#f4f4f4');

            }
        )
        // })
    });

})(liefeng, React)
